<template>
    <div>
      <el-dialog title="上传文件"
                 :visible.sync="showDiaLog"
                 :width="dialogWidth"
                 :height="dialogHeight"
                 @close="closeDialog"
                 append-to-body>

          <el-upload
                  class="upload-demo"
                  drag
                  action="/res/album/swf_upload"
                  :headers="header"
                  :data="uploadData"
                  :before-upload="beforeAvatarUpload"
                  :on-success="onSuccess"
                  :on-error="onError"
                  :file-list="fileList"
                  :accept="aceeptExt"
                  multiple>
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
              <div class="el-upload__tip" slot="tip">只能上传{{aceeptExt}}文件，且不超过{{limitFileSize}}MB</div>
          </el-upload>

      </el-dialog>
    </div>
</template>

<script>
import {getToken} from "@/util/store";
import {getUpload} from "@/api/base/sysSet/uploadSet";

import constants from "@/const/constants";

export default {
    props: {
        albumId:{   //文件上传目标文件夹id
            type:String,
            default:''
        },
        albumCode:{ //文件上传目标文件夹编码
            type:String,
            default:""
        },
        dialogWidth:{
            type:String,
            default:"400px"
        },
        dialogHeight:{
            type:String,
            default:"400px"
        },
        resType:{   //文件上传文件类型
            type:String,
            default:constants.FILE_TYPE_PIC
        },
    },
    computed:{
        uploadData(){   //图片上传封装的参数
            return {
                album_id:this.albumId,
                album_code:this.albumCode
            }
        }
    },
	watch: {
	  resType (newValue) {
		  console.log("000000")
			getUpload().then(res=>{
			    debugger
				if(res.data.code==200){
				    debugger
					let data= res.data.data
					this.constant = data
					this.limitFileSize = data.imageFileSize;
					this.aceeptExt = data.imageSuffix;
				}
			})
			if (constants.FILE_TYPE_PIC === newValue) {
				this.limitFileSize = this.constant.imageFileSize;
				this.aceeptExt = this.constant.imageSuffix;
			} else if (constants.FILE_TYPE_VIDEO === newValue) {
				this.limitFileSize = this.constant.videoFileSize;
				this.aceeptExt = this.constant.videoSuffix;
			} else if (constants.FILE_TYPE_FILE === newValue) {
				this.limitFileSize = this.constant.fileFileSize;
				this.aceeptExt = this.constant.fileSuffix;
			}
	  }
	},
    created(){
		console.log("creaddddd")
		getUpload().then(res=>{
			if(res.data.code==200){
				let data= res.data.data
				this.constant = data
				this.limitFileSize = data.imageFileSize;
                console.log(constants);
                if ( constants.FILE_TYPE_PIC == this.resType) {
                    this.limitFileSize = this.constant.imageFileSize;
                    this.aceeptExt = this.constant.imageSuffix;
                } else if (constants.FILE_TYPE_VIDEO == this.resType) {
                    this.limitFileSize = this.constant.videoFileSize;
                    this.aceeptExt = this.constant.videoSuffix;
                } else if (constants.FILE_TYPE_FILE == this.resType) {
                    this.limitFileSize = this.constant.fileFileSize;
                    this.aceeptExt = this.constant.fileSuffix;
                }
			}
		})
    },
    data () {
        return {
            showDiaLog: false,
            header:{    //增加授权token
                Authorization:getToken()
            },
            limitFileSize:null,    //上传文件大小限制
            aceeptExt:null,      //上传文件可接受的扩展名
            uploadFileUrl:[],   //刚上传的图片url
            fileList:[],         //上传组件中的文件列表
			constant:{}
        }
    },
    methods: {
        open(){
            //打开上传页面
            this.uploadFileUrl = [];
            this.fileList = [];
            this.showDiaLog = true;
        },
        closeDialog () {
            //关闭弹窗回调
            this.$emit('callback', this.uploadFileUrl);
        },
        beforeAvatarUpload(file) {
            //限制文件大小
            if (file.size > this.limitFileSize * 1024 * 1024) {
                this.$message.error('上传文件大小不能超过 '+this.limitFileSize+'MB!');
                return false;
            }
            return true;
        },
        onSuccess(response, file, fileList){
            if(response.code == 200){
                this.$message.success("上传成功！");
                this.uploadFileUrl.push(response.data);
            }else{
                this.fileList = fileList.filter((item)=>{
                    if (!(file.name == item.name && file.size == item.size)) {
                        return item;
                    }
                });
                this.$message.error(response.message);
            }

        },
        onError(err){
            this.$message.error(err);
        }
    }
}
</script>
<style>
</style>